<%--
  Created by IntelliJ IDEA.
  User: KING
  Date: 2021/1/27
  Time: 16:23
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<html>
<head>
    <title>药品信息</title>
    <script src=" webjars/jquery/3.5.1/jquery.js"></script>
    <script src="webjars/bootstrap/4.5.3/js/bootstrap.js"></script>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/manager.css"/>
    <script type="text/javascript">
        $(function(){
            /* 显示药品类别页面 */
            $(".doc_type").click(function(){
                $(".msg").css("display","none");
                $(".docType_manager").css("display","block");
                $(".titText").css("font-weight","400");
                $(this).css("font-weight","600");
            })

            /* 显药品信息页面 */
            $(".doc_msg").click(function(){
                $(".msg").css("display","none");
                $(".doc_Info").css("display","block");
                $(".titText").css("font-weight","400");
                $(this).css("font-weight","600");
            })

            // 点击除按钮和弹框之外任意地方隐藏弹窗
            $("body").click(function (e) {
                if (!$(e.target).closest(".insertBtn,.addrow,.updateBtn").length) {
                    $(".addrow").hide();
                }
            });


            // 点击除按钮和弹框之外任意地方隐藏弹窗
            $("body").click(function (e) {
                if (!$(e.target).closest(".insertIntrBtn,.addInfo,.updateIntrBtn").length) {
                    $(".addInfo").hide();
                }
            });
            /* 修改医院简介 */
            $(".updateIntrBtn").click(function() {
                $(".addInfo").toggle();
            });

            /* 新增医生信息 */
            $(".docInsert").click(function() {
                $(".addmsg").toggle();
            });

            /* 修改医生信息 */
            $(".docUpdate").click(function() {
                $(".updmsg").toggle();
            });

            // 点击除按钮和弹框之外任意地方隐藏弹窗
            $("body").click(function (e) {
                if (!$(e.target).closest(".docInsert,.addmsg,.updmsg,.docUpdate").length) {
                    $(".addmsg,.updmsg").hide();
                }
            });
            /* 提交 */
            $(".addrow_submit").click(function(){
                $(".addrow").hide();
            })

            /* 取消 */
            $(".addrow_reset").click(function(){
                $(".addrow").hide();
            })
            $(".doc_reset").click(function(){
                $(".addmsg").hide();
            })
            $(".doc_reset").click(function(){
                $(".updmsg").hide();
            })

            /* 添加排班信息 */
            $(".scheInsert").click(function() {
                $(".sche_info").toggle();
            });

            // 点击除按钮和弹框之外任意地方隐藏弹窗
            $("body").click(function (e) {
                if (!$(e.target).closest(".scheInsert,.sche_infoUl,sche_tab,.scheUpdate").length) {
                    $(".sche_info").hide();
                }
            });
        })
        // 修改
        function onUpdatemed(){
            $(".updtr").each(function (index, aa) {
                // 是否被选中
                let checked = $(aa).children().first().children().first().prop("checked");
                if (checked) {
                    // 选中的id值
                    let mId = $(aa).children().first().children().first().val();
                    console.log(mId)
                    // 和后台交互

                    //  获取信息并赋值给input
                    $(".addmId").val(mId);
                    let mName = $("#"+mId+'a').text();
                    $(".addmName").val(mName);
                    // 方法2
                    $(".addmPrice").val($("#"+mId+'b').text())
                    $(".addmmType").val($("#"+mId+'c').text())
                    $(".addmFactory").val($("#"+mId+'d').text())
                    $(".addmNumber").val($("#"+mId+'e').text())


                }
            })
        }
        // 获取表单数据
        function updmed(){
            let mId = $(".addmId").val();
            let mName = $(".addmName").val();
            let mPrice= $(".addmPrice").val();
            let mmType= $(".addmmType").val();
            let mFactory = $(".addmFactory").val();
            let mNumber = $(".addmNumber").val();

            $.ajax({
                method:'put',
                url:"${pageContext.request.contextPath}/updmedUi",
                dataType: "json",
                data: {
                    mId:mId,
                    mName:mName,
                    mPrice:mPrice,
                    mmType:mmType,
                    mFactory:mFactory,
                    mNumber:mNumber
                },
                success: function (result) {
                    window.location.href = "${pageContext.request.contextPath}/medicineUi";
                }
            })
        }

        // 删除
        function ondelmed(){
            $(".updtr").each(function (index, aa) {
                // 是否被选中
                let checked = $(aa).children().first().children().first().prop("checked");
                if (checked) {
                    // 选中的id值
                    let mId = $(aa).children().first().children().first().val();
                    console.log(mId)
                }
            })
        }



    </script>
    <style>
        ul li{
            list-style: none;
            text-align: center;
        }
        .med_submit{
            float: left;
        }
    </style>
</head>
<body>
<%-- 药品类型管理 --%>
<div class="right_msg">
    <div class="doc_Info msg">
        <span class="docInfo_title titl">药品信息</span>
        <button type="button" class="btn insert_docInfo docInsert addBtn" >添加</button>
        <button type="button" class="btn update_docInfo docUpdate modBtn" onclick="onUpdatemed()">修改</button>
        <button type="button" class="btn delete_docInfo delBtn" onclick="ondelmed()">删除</button>
            <table class="docType_tab" style="width: 1200px">
                <tr>
                    <th>序号</th>
                    <th>类型名称</th>
                </tr>
                <c:forEach items="${medicineTypes }" var="Type" varStatus="var">
                <tr>
                    <td>
                        <input type="checkbox" name="" /> ${var.count }
                    </td>
                    <td>${Type.mtName }</td>
                </tr>
                </c:forEach>
            </table>
    </div>

    <!-- 添加药品信息 -->
    <div class="addmsg">
        <form id="medadd-input" action="${pageContext.request.contextPath }/addmedUi" method="post" >
            <ul class="addmsgUl1">
                <li>名称: <input type="text"  name="mName" placeholder="请输入药品名称"/></li>
                <li>价格: <input type="text" name="mPrice" placeholder="请输入价格"/></li>
                <li>类型:  <select  style="width: 150px" name="mmType">
                    <c:forEach items="${medicineTypes }" var="Types" varStatus="var">
                        <option value="${Types.mtName }">${Types.mtName }</option>
                    </c:forEach>
                </select></li>
            </ul>
            <ul class="addmsgUl2">
                <li>厂家: <input type="text" name="mFactory" placeholder="请输入厂家"/></li>
                <li>数量: <input type="text" name="mNumber" placeholder="请输入数量"/></li>
                <li><div style="{width: 100px;height: 25px}"></div></li>
            </ul>

            <button type="submit" class="doc_submit">提交</button>
            <button type="button" class="doc_reset">取消</button>
        </form>
    </div>

</div>
</body>
</html>
